<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>小兔鲜儿 - 新鲜 惠民 快捷!</title>
    <link rel="stylesheet" href="./css/style.css" />
  </head>
  <body>
    <!-- 头部导航 -->
    <div class="topnav">
      <div class="nav w">
        <ul>
          <li><a href="javascript:;">请先登录</a></li>
          <li><a href="javascript:;">免费注册</a></li>
          <li><a href="javascript:;">我的订单</a></li>
          <li><a href="javascript:;">会员中心</a></li>
          <li><a href="javascript:;">帮助中心</a></li>
          <li><a href="javascript:;">在线客服</a></li>
          <li>
            <a href="javascript:;">
              <i class="phone sprites"></i>
              手机版
            </a>
          </li>
        </ul>
      </div>
    </div>
    <!-- 头部 -->
    <div class="header w">
      <!-- 网站logo -->
      <img src="./images/logo.png" alt="" class="logo" />
      <!-- 站内搜索 -->
      <div class="search">
        <!-- 购物车 
        <a href="#" class="search-cart sprites">
            <i>2</i>
        </a> -->
        <!-- 主导航 -->
        <div class="navs">
          <ul class="clearfix">
            <li><a href="#">首页</a></li>
            <li><a href="#">生鲜</a></li>
            <li><a href="#">美食</a></li>
            <li><a href="#">餐厨</a></li>
            <li><a href="#">电器</a></li>
            <li><a href="#">居家</a></li>
            <li><a href="#">洗护</a></li>
            <li><a href="#">孕婴</a></li>
            <li><a href="#">服装</a></li>
            <li><a href="#">杂货</a></li>
          </ul>
        </div>
        <!-- 购物车 -->
        <a href="#" class="search_cart sprites">
          <i>2</i>
        </a>
        <!-- 搜索框 -->
        <div class="search_wrapper">
          <input type="text" placeholder="搜一搜" />
        </div>
      </div>
    </div>
    <!-- 分类及焦点图 -->
    <div class="container">
      <!-- 版心 -->
      <div class="w">
        <!-- 分类 -->
        <div class="fenlei">
          <ul>
            <li>
              <a href="javascript:;">
                生鲜
                <small>水果</small>
                <small>蔬菜</small>
              </a>
              <i class="sprites"></i>
            </li>
            <li>
              <a href="javascript:;">
                美食
                <small>面点</small>
                <small>干果</small>
              </a>
              <i class="sprites"></i>
            </li>
            <li>
              <a href="javascript:;">
                电器
                <small>数码产品</small>
              </a>
              <i class="sprites"></i>
            </li>
            <li>
              <a href="javascript:;">
                电器
                <small>床品</small>
                <small>四件套</small>
                <small>被枕</small>
              </a>
              <i class="sprites"></i>
            </li>
            <li>
              <a href="javascript:;">
                居家
                <small>奶粉</small>
                <small>玩具</small>
                <small>辅食</small>
              </a>
              <i class="sprites"></i>
            </li>
            <li>
              <a href="javascript:;">
                洗护
                <small>洗发</small>
                <small>洗护</small>
                <small>美妆</small>
              </a>
              <i class="sprites"></i>
            </li>
            <li>
              <a href="javascript:;">
                孕婴
                <small>奶粉</small>
                <small>玩具</small>
              </a>
              <i class="sprites"></i>
            </li>
            <li>
              <a href="javascript:;">
                服饰
                <small>女装</small>
                <small>男装</small>
              </a>
              <i class="sprites"></i>
            </li>
            <li>
              <a href="javascript:;">
                杂货
                <small>户外</small>
                <small>图书</small>
              </a>
              <i class="sprites"></i>
            </li>
            <li>
              <a href="javascript:;">
                品牌
                <small>品牌制造</small>
              </a>
              <i class="sprites"></i>
            </li>
          </ul>
          <!-- 子分类 -->
          <div class="category_subset"></div>
        </div>
        <!-- 焦点图 -->
        <div class="tuzi">
          <a href="#">
            <img src="./images/tuzi.png" alt="" />
          </a>
          <a href="#" class="prev">&lt;</a>
          <a href="#" class="next">&gt;</a>
          <ul class="indicator">
            <li></li>
            <li></li>
            <li class="selected"></li>
            <li></li>
            <li></li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 新鲜好物 -->
    <div class="goods w">
      <div class="text">
        <h3>
          新鲜好物
          <small>新鲜出炉 品质靠谱</small>
        </h3>
        <a href="#" ciass="all">
          查看全部
          <i class="sprites"></i>
        </a>
      </div>
      <!-- 商品列表 -->
      <div class="wu w">
        <a href="javascript:;">
          <img src="./uploads/new_goods_1.jpg" alt="" />
          <span class="name">睿米无线吸尘器F8</span>
          <span class="price"><small>￥</small>899</span>
        </a>
        <a href="javascript:;">
          <img src="./uploads/new_goods_2.jpg" alt="" />
          <span class="name">智能环绕3D空调</span>
          <span class="price"><small>￥</small>1299</span>
        </a>
        <a href="javascript:;">
          <img src="./uploads/new_goods_3.jpg" alt="" />
          <span class="name">广东软软糯米煲仔饭</span>
          <span class="price"><small>￥</small>129</span>
        </a>
        <a href="javascript:;">
          <img src="./uploads/new_goods_4.jpg" alt="" />
          <span class="name">罗西机械智能手表</span>
          <span class="price"><small>￥</small>3399</span>
        </a>
      </div>
    </div>
    <!-- 人气推荐 -->
    <div class="goods w">
      <div class="text">
        <h3>
          人气推荐
          <small>人气爆款 不容错过</small>
        </h3>
      </div>
      <!-- 商品列表 -->
      <div class="wu w">
        <a href="javascript:;">
          <img src="./uploads/popular_1.jpg" />
          <span class="title">特惠推荐</span>
          <span class="alt">我猜得到 你的需要</span>
        </a>
        <a href="javascript:;">
          <img src="./uploads/popular_2.jpg" />
          <span class="title">爆款推荐</span>
          <span class="alt">人气好物推荐</span>
        </a>
        <a href="javascript:;">
          <img src="./uploads/popular_3.jpg" />
          <span class="title">场景使用一站买全</span>
          <span class="alt">编辑精心整理推荐</span>
        </a>
        <a href="javascript:;">
          <img src="./uploads/popular_4.jpg" />
          <span class="title">领券中心</span>
          <span class="alt">发现更多超值优惠券</span>
        </a>
      </div>
    </div>
    <!-- 热门品牌 -->
    <div class="remen">
      <div class="re w">
        <div class="text">
          <h3>
            热门品牌
            <small>国际经典 品质保证</small>
          </h3>
        </div>
        <!-- 商品列表 -->
        <div class="pin">
          <a href="#">
            <img src="./uploads/brand_goods_1.jpg" alt="" />
          </a>
          <a href="#">
            <img src="./uploads/brand_goods_2.jpg" alt="" />
          </a>
          <a href="#">
            <img src="./uploads/brand_goods_3.jpg" alt="" />
          </a>
          <a href="#">
            <img src="./uploads/brand_goods_4.jpg" alt="" />
          </a>
          <a href="#">
            <img src="./uploads/brand_goods_5.jpg" alt="" />
          </a>
        </div>
      </div>
    </div>
    <!-- 生鲜商品 -->

    <div class="shengxian w">
      <div class="wenzi w">
        <h3>生鲜</h3>
        <a href="#" class="guo">水果</a>
        <a href="#">蔬菜</a>
        <a href="#">肉禽蛋</a>
        <a href="#">裤装</a>
        <a href="#">衬衫</a>
        <a href="#">内衣</a>
        <a href="#" class="all">
          查看全部
          <i class="sprites"></i>
        </a>
      </div>
      <!-- 茅台 -->
      <div class="shi">
        <a href="#">
          <img src="./uploads/fresh_goods_cover.jpg" alt="" />
        </a>
        <div class="zhe">
          <span>生鲜馆</span>
          <span>全场3件8折</span>
        </div>
      </div>
      <!-- 商品图片 -->
      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/fresh_goods_1.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>
            美威 智利原味三文鱼排 <br />
            240g/袋 4片装
          </p>
          <p>海鲜年货</p>
          <p class="price"><small>￥</small>59</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/fresh_goods_2.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>
            红功夫 麻辣小龙虾1.5kg <br />
            4-6/25-32只
          </p>
          <p>火锅食材</p>
          <p class="price"><small>￥</small>79</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/fresh_goods_3.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>
            三都港 冷冻无公害黄花鱼 <br />
            700g 2条 袋装
          </p>
          <p>海鲜水产</p>
          <p class="price"><small>￥</small>49</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/fresh_goods_4.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>
            渔公码头 大连鲜食入味 <br />
            即食海参 辽参刺参
          </p>
          <p>调海味</p>
          <p class="price"><small>￥</small>899</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/fresh_goods_5.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>越南进口白心火龙果 <br />4个装 标准果</p>
          <p>单果400-550g</p>
          <p class="price"><small>￥</small>29</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/fresh_goods_6.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>广西沃柑 柑橘1.5kg</p>
          <p>新鲜水果</p>
          <p class="price"><small>￥</small>59</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/fresh_goods_7.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>
            进口 牛油果6个装 <br />
            果重约130-180g
          </p>
          <p>新鲜水果</p>
          <p class="price"><small>￥</small>39.9</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/fresh_goods_8.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>泰国进口山竹5A级 500g</p>
          <p>新鲜水果</p>
          <p class="price"><small>￥</small>29.9</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>
    </div>

    <!-- 服饰商品 -->
    <div class="shengxian w">
      <div class="wenzi w">
        <h3>行李箱</h3>
        <a href="#" class="guo">男士包袋</a>
        <a href="#">女士包袋</a>
        <a href="#">钱包及小皮件</a>
        <a href="#">男鞋</a>
        <a href="#">女鞋</a>
        <a href="#">拖鞋 </a>
        <a href="#" class="all">
          查看全部
          <i class="sprites"></i>
        </a>
      </div>
      <!-- 茅台 -->
      <div class="shi">
        <a href="#">
          <img src="./uploads/fresh_goods_cover.jpg" alt="" />
        </a>
        <div class="zhe">
          <span>服饰馆</span>
          <span>3折起狂欢</span>
        </div>
      </div>
      <!-- 商品图片 -->
      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/clothes_goods_1.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>人本秋季厚底帆布鞋</p>
          <p></p>
          <p class="price"><small>￥</small>59</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/clothes_goods_2.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>
            红功夫 麻辣小龙虾1.5kg <br />
            4-6/25-32只
          </p>
          <p>火锅食材</p>
          <p class="price"><small>￥</small>79</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/brand_goods_3.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>
            三都港 冷冻无公害黄花鱼 <br />
            700g 2条 袋装
          </p>
          <p>海鲜水产</p>
          <p class="price"><small>￥</small>49</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/clothes_goods_4.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>
            渔公码头 大连鲜食入味 <br />
            即食海参 辽参刺参
          </p>
          <p>调海味</p>
          <p class="price"><small>￥</small>899</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/clothes_goods_5.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>越南进口白心火龙果 <br />4个装 标准果</p>
          <p>单果400-550g</p>
          <p class="price"><small>￥</small>29</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/clothes_goods_6.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>广西沃柑 柑橘1.5kg</p>
          <p>新鲜水果</p>
          <p class="price"><small>￥</small>59</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/clothes_goods_7.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>
            进口 牛油果6个装 <br />
            果重约130-180g
          </p>
          <p>新鲜水果</p>
          <p class="price"><small>￥</small>39.9</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>

      <div class="picture">
        <div class="tu">
          <a href="#">
            <img src="./uploads/clothes_goods_8.jpg" alt="" />
          </a>
        </div>
        <!-- 商品信息 -->
        <div class="xinxi">
          <p>泰国进口山竹5A级 500g</p>
          <p>新鲜水果</p>
          <p class="price"><small>￥</small>29.9</p>
        </div>
        <div class="tan">
          <a href="#">
            <span class="zhao">找相似</span>
            <span>发现更多宝贝</span>
          </a>
        </div>
      </div>
    </div>

    <!-- 大家都在说 -->
    <div class="box w">
      <div class="box-header">
        <h3>大家都在说</h3>
        <a href="#" class="all">查看全部</a>
      </div>
      <div>
        <ul>
          <li>
            <a href="javascript:;">
              <img src="./uploads/discuss_goods_1.jpg" alt="" />
            </a>
            <div class="meta">
              <div class="title">
                日本制造 红木柜茶几 <small>小花 2020-05-09 13:33</small>
              </div>
              <span class="price"> <small>￥</small>1199起 </span>
            </div>
            <p class="message">
              从小我就看我奶奶把用完的超市塑料袋整整齐齐叠放好,等以后需要再拿出用.现在奶奶已经不在了,塑料袋也要收费了.奶奶不紧不慢,把袋子认真折好的场景,一直在脑海挥之不去.
            </p>
          </li>
          <li>
            <a href="javascript:;">
              <img src="./uploads/discuss_goods_2.jpg" alt="" />
            </a>
            <div class="meta">
              <div class="title">
                日本制造 红木柜茶几 <small>小花 2020-05-09 13:33</small>
              </div>
              <span class="price"> <small>￥</small>1199起 </span>
            </div>
            <p class="message">
              从小我就看我奶奶把用完的超市塑料袋整整齐齐叠放好,等以后需要再拿出用.现在奶奶已经不在了,塑料袋也要收费了.奶奶不紧不慢,把袋子认真折好的场景,一直在脑海挥之不去.
            </p>
          </li>
          <li>
            <a href="javascript:;">
              <img src="./uploads/discuss_goods_3.jpg" alt="" />
            </a>
            <div class="meta">
              <div class="title">
                日本制造 红木柜茶几 <small>小花 2020-05-09 13:33</small>
              </div>
              <span class="price"> <small>￥</small>1199起 </span>
            </div>
            <p class="message">
              从小我就看我奶奶把用完的超市塑料袋整整齐齐叠放好,等以后需要再拿出用.现在奶奶已经不在了,塑料袋也要收费了.奶奶不紧不慢,把袋子认真折好的场景,一直在脑海挥之不去.
            </p>
          </li>
        </ul>
      </div>
    </div>
    <!-- 公共底部 -->
   <div class="footer">
     <div class="footer-body w">
       <div class="contact">
        <dl>
          <dt>客户服务</dt>
          <dd class="chat">在线客服</dd>
          <dd class="feedback">问题反馈</dd>
        </dl>
        <dl>
          <dt>关注我们</dt>
          <dd class="weixin">公众号</dd>
          <dd class="weibo">微博</dd>
        </dl>
        <dl>
          <dt>下载APP</dt>
          <dd class="qrcode">
            <img src="./uploads/qrcode.jpg">
          </dd>
          <dd class="download">
            <span>扫描二维码</span>
            <span>立马下载APP</span>
            <a href="javascript:;">下载页面</a>
          </dd>
        </dl>
        <dl>
          <dt>服务热线</dt>
          <dd class="hotline">
            400-0000-000
            <small>周一至周日 8:00-18:00</small>
          </dd>
        </dl>
       </div>
     </div>
   </div>

  </body>
</html>
